<!--
  Copyright 2012-2018 the original author or authors.

  Licensed under the Apache License, Version 2.0 (the "License");
  you may not use this file except in compliance with the License.
  You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
-->
<!-- clearfix is needed for smaller screens where gt-config-return-link is floated  -->
<div class="clearfix">
  <a class="gt-config-return-link"
     href="config/gauge-list{{agentQueryString()}}">
    Return to list
  </a>
</div>
<div class="card">
  <div class="card-header">
    <h2 ng-class="{'gt-lighten-font': !loaded && !httpError}">
      Gauges
      <span class="d-inline-block gt-separator">
        |
      </span>
      <span style="font-size: 24px;">{{heading}}</span>
    </h2>
  </div>
  <div class="card-body">
    <div ng-include src="'template/gt-loading-overlay.html'"></div>
    <div ng-include src="'template/gt-http-error-overlay.html'"></div>
    <div ng-if="agentNotConnected" class="alert alert-warning">
      Limited functionality since agent is not currently connected
    </div>
    <form gt-form-autofocus-on-first-input
          name="formCtrl"
          style="padding-top: 15px;"
          novalidate>
      <div class="form-group row">
        <label class="col-xl-3 gt-form-label-xl"
               for="mbeanObjectName{{$id}}">
          MBean object name
        </label>
        <div class="col-xl-9">
          <input type="text"
                 class="form-control"
                 ng-model="config.mbeanObjectName"
                 ng-required="true"
                 ng-disabled="!agentRollup.permissions.config.edit.gauges"
                 uib-typeahead="suggestion for suggestion in mbeanObjectNames($viewValue)"
                 typeahead-on-select="onSelectMBeanObjectName()"
                 ng-blur="onBlurMBeanObjectName()"
                 name="mbeanObjectName"
                 id="mbeanObjectName{{$id}}"
                 style="max-width: 40em; display: inline-block">
          <div gt-spinner
               gt-spinner-inline="true"
               gt-show="showMBeanObjectNameSpinner"
               class="gt-inline-spinner">
          </div>
          <div class="gt-red"
               ng-if="noMatchFoundForPattern"
               style="padding-top: 10px;">
            No matching MBean found
          </div>
          <div class="gt-red"
               ng-if="noMatchFoundForNonPattern"
               style="padding-top: 10px;">
            MBean not found
          </div>
          <div class="gt-red"
               ng-if="duplicateMBean"
               style="padding-top: 10px;">
            There is already a gauge for this MBean
          </div>
          <div class="help-block">
            If the object name includes at least one occurrence of the wildcard characters asterisk (*) or question mark
            (?), then the object name is a pattern. The asterisk matches any sequence of zero or more characters, while
            the question mark matches any single character.
            (see
            <a href="https://docs.oracle.com/javase/8/docs/api/javax/management/ObjectName.html">
              https://docs.oracle.com/javase/8/docs/api/javax/management/ObjectName.html</a>)
          </div>
        </div>
      </div>
      <fieldset class="form-group">
        <div class="row">
          <legend class="col-xl-3 gt-check-legend-xl">
            MBean attributes
          </legend>
          <div class="col-xl-9">
            <div gt-spinner
                 gt-show="mbeanAttributesLoading && !httpError"
                 class="gt-inline-spinner d-none"
                 style="height: 50px;">
            </div>
            <div ng-repeat="mbeanAttribute in allMBeanAttributes | orderBy:'name'">
              <label class="custom-control custom-checkbox d-inline-block">
                <input type="checkbox"
                       class="custom-control-input"
                       ng-model="mbeanAttribute.checked"
                       ng-disabled="!agentRollup.permissions.config.edit.gauges">
                <div class="custom-control-label">
                  {{mbeanAttribute.name.replace('/', ' / ')}}
                  <span ng-if="!mbeanAttribute.available && !noMatchFoundForPattern && !noMatchFoundForNonPattern"
                        class="gt-red"
                        style="padding-left: 10px;">
                    Attribute not found
                  </span>
                </div>
              </label>
              <label class="custom-control custom-checkbox d-inline-block ml-5"
                     ng-if="mbeanAttribute.checked">
                <input type="checkbox"
                       class="custom-control-input"
                       ng-model="mbeanAttribute.counter"
                       ng-disabled="!agentRollup.permissions.config.edit.gauges">
                <div class="custom-control-label">
                  Counter?
                </div>
              </label>
            </div>
            <div class="font-italic"
                 ng-if="!config.mbeanObjectName">
              (select MBean object name first)
            </div>
            <div class="gt-red pt-0"
                 ng-if="config.mbeanObjectName && !allMBeanAttributes.length && !noMatchFoundForPattern && !noMatchFoundForNonPattern && selectedMBeanObjectName">
              There are no number-valued attributes for this MBean
            </div>
            <div class="help-block"
                 ng-if="config.mbeanAttributes.length">
              Marking an MBean attribute as a counter indicates that it is a monotonically increasing value (e.g. the
              total garbage collection time since JVM startup). When an mbean attribute is marked as a counter, the
              deltas are captured and displayed instead of the raw values (e.g. the total garbage collection time since
              the last capture). Also, when rolling up mbean attributes that are marked as counters, the (delta) values
              are weighted by the time between captures instead of a straight average.
            </div>
          </div>
        </div>
      </fieldset>
      <div class="form-group row"
           ng-if="agentRollup.permissions.config.edit.gauges">
        <div class="offset-xl-3 col-xl-9">
          <div gt-button-group>
            <div gt-button
                 gt-label="{{config.version ? 'Save changes' : 'Add'}}"
                 gt-click="save(deferred)"
                 gt-validate-form="formCtrl"
                 class="d-inline-block">
            </div>
            <div gt-button
                 ng-if="config.version"
                 gt-label="Delete"
                 gt-click="delete(deferred)"
                 gt-btn-class="btn-danger"
                 class="d-inline-block">
            </div>
          </div>
        </div>
      </div>
    </form>
  </div>
</div>
<!-- each page with confirmation dialog needs its own confirmation dom so that it is deleted on $destroy -->
<div ng-include="'template/gt-confirmation.html'"></div>
